<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>订单详情页</title>

    <script type="text/javascript" src="/bootstrap-3.3.7-dist/js/bootstrap.js"></script>

    <script type="text/javascript" src="/bootstrap-3.3.7-dist/css/bootstrap.css"></script>

    <script type="text/javascript" src="/js/jquery-1.12.4.min.js"></script>

    <script type="text/javascript" src="/js/jquery.md5.js"></script>

    <script type="text/javascript" src="/js/common.js"></script>

</head>
<body>

    <div>秒杀订单详情</div>
    <table class="table" id="goodsList">

        <tr>
            <td>商品名称</td>
            <td id="goodsName" ></td>
        </tr>

        <tr>
            <td>商品图片</td>
            <td><img id="goodsImg" width="100" height="100"/></td>
        </tr>

        <tr>
            <td>订单价格</td>
            <td id="goodsPrice"></td>
        </tr>

        <tr>
            <td>下单时间</td>
            <td  id="createDate"></td>
        </tr>

        <tr>
            <td>订单状态</td>
            <td id="OrderStatus"></td>
            <td>
                <button class="btn btn-block btn-primary" type="submit" id="payButton">立即支付</button>
            </td>
        </tr>

        <tr>
            <td>收货人</td>
            <td>李女士</td>
        </tr>

        <tr>
            <td>收货地址</td>
            <td>四川省成都市高新西区</td>
        </tr>

    </table>

</body>

<script>

    $(function () {

        getOrderDetail();
    })


    function getOrderDetail(){

        var orderId = g_getQueryString("orderId");  //从传过来的路由中取到值

        $.ajax({
            url:"/order/detail",
            data: {
                orderId: orderId
            },
            type:"get",
            success:function (data) {

                if (data.code == 0){

                    render(data.data);

                }else{
                    alert(data.msg);
                }
            },
            error:function () {

                alert("秒杀失败")
            }

        })

    }
    
    function render(detail) {

        var goods = detail.goods;
        var orderInfo = detail.orderInfo;

        $("#goodsName").text(goods.goodsName);
        $("#goodsImg").attr("src",goods.goodsImg);
        $("#goodsPrice").text(orderInfo.goodsPrice);
        $("#createDate").text(new Date(orderInfo.createDate).format("yyyy-MM-dd hh:mm:ss"));

        var status = "";
        if (orderInfo.status == 0){
            status = "未支付";
        }else if (orderInfo.status == 1){
            status = "已支付";
        }else if (orderInfo.status == 2){
            status = "已发货";
        }else if (orderInfo.status == 3){
            status = "已收货";
        }else if (orderInfo.status == 4){
            status = "已退款";
        }else{
            status = "已完成";
        }

        $("#OrderStatus").text(status);
    }


</script>
</html>